import { createRouter, createWebHashHistory } from 'vue-router'
import NProgress from 'nprogress'
import 'nprogress/nprogress.css'
import useLogin from '@/stores/login.js'
import i18n from '@/lang/index'
import { watch } from 'vue'

const t = i18n.global.t

NProgress.configure({
  easing: 'ease', // 动画方式
  speed: 1000, // 递增进度条的速度
  showSpinner: false, // 是否显示加载ico
  trickleSpeed: 200, // 自动递增间隔
  minimum: 0.3 // 初始化时的最小百分比
})

const routes = [
  {
    path: '/',
    redirect: '/index',
    component: () => import('@/views/layout/Layout.vue'),
    children: [
      {
        path: '/index', // 主页
        name: 'index',
        component: () => import('@/views/index/Index.vue'),
        meta: {
          freeze: true
        }
      },
      {
        path: '/news', // 新闻
        name: 'news',
        component: () => import('@/views/news/News.vue'),
        meta: {
          title: 'header.menu2'
        }
      },
      {
        path: '/detail', // 新闻详情
        name: 'detail',
        component: () => import('@/views/news/Detail.vue'),
        meta: {
          title: 'header.menu2'
        }
      },
      {
        path: '/indice', // 指数
        name: 'indice',
        component: () => import('@/views/indice/Indice.vue'),
        meta: {
          title: 'header.menu3'
        }
      },
      {
        path: '/tech', // 技术规则
        name: 'tech',
        component: () => import('@/views/tech/Tech.vue'),
        meta: {
          title: 'header.menu5'
        }
      },
      {
        path: '/techList', // 技术规则 列表
        name: 'techList',
        component: () => import('@/views/tech/List.vue'),
        meta: {
          title: 'header.menu5'
        }
      },
      {
        path: '/techDetail', // 技术规则 详情
        name: 'techDetail',
        component: () => import('@/views/tech/Detail.vue'),
        meta: {
          title: 'header.menu5'
        }
      },
      {
        path: '/blog', //社区
        name: 'blog',
        component: () => import('@/views/blog/Blog.vue'),
        meta: {
          // needLogin: true,
          title: 'header.menu4'
        }
      },
      {
        path: '/blogDetail',
        name: 'blogDetail',
        component: () => import('@/views/blog/BlogDetail.vue'),
        meta: {
          title: 'header.menu4'
        }
      },
      {
        path: '/member', // 会员对外展示页
        name: 'member',
        component: () => import('@/views/blog/Member.vue')
      },
      {
        path: '/shipyard', // 船厂对外展示页
        name: 'shipyard',
        component: () => import('@/views/blog/Shipyard.vue')
      },
      {
        path: '/crew',
        name: 'crew',
        component: () => import('@/views/crew/Index.vue'),
        meta: {
          // needLogin: true, // 需要登录
          title: 'header.menu6'
        }
      },

      {
        path: '/dockRepair', // 坞修服务
        name: 'dockRepair',
        component: () => import('@/views/dockRepair/DockRepair.vue'),
        meta: {
          role: ['05', '06'], // 身份   只有身份为【船东】、【船管】，才能发起坞修
          errmsg: t('router.e1'),
          needLogin: true // 需要登录
        }
      },
      {
        path: '/dockRepair/introduce', // 坞修介绍页
        name: 'dockRepairIntroduce',
        component: () => import('@/views/dockRepair/Introduce.vue')
      },
      {
        path: '/procurement', // 采购服务
        name: 'procurement',
        component: () => import('@/views/procurement/Procurement.vue'),
        meta: {
          rerole: ['15', '20', '21'], // 身份   除了船员、个人、其他
          errmsg: t('router.e3'),
          needLogin: true
        }
      },
      {
        path: '/procurement/introduce', // 采购介绍页
        name: 'procurementIntroduce',
        component: () => import('@/views/procurement/Introduce.vue')
      },
      {
        path: '/externalAssistance', // 外协服务
        name: 'externalAssistance',
        component: () => import('@/views/externalAssistance/ExternalAssistance.vue'),
        meta: {
          role: ['05', '06', '07'], // 身份  只有身份为【船东】、【船管】、【修船厂】，才能发起外协
          errmsg: t('router.e2'),
          needLogin: true // 需要登录
        }
      },
      {
        path: '/externalAssistance/introduce', // 外协介绍页
        name: 'outsourceIntroduce',
        component: () => import('@/views/externalAssistance/Introduce.vue')
      },
      {
        path: '/about',
        name: 'about',
        component: () => import('@/views/aboutUs/Index.vue'),
        meta: {
          title: 'header.menu7'
        }
      },
      {
        path: '/crewResume',
        name: 'crewResume',
        component: () => import('@/views/crew/CrewResume.vue'),
        meta: {
          hideNav: true
        }
      },
      {
        path: '/addCrewResume',
        name: 'addCrewResume',
        component: () => import('@/views/crew/AddCrewResume.vue'),
        meta: {
          hideNav: true,
          needLogin: true,
          role: ['15'] // 船员
        }
      },
      {
        path: '/personalInformation',
        name: 'personalInformation',
        component: () => import('@/views/personalInformation/Index.vue'),
        meta: {
          hideNav: true
        }
      },
      // {
      //   path: '/personalHomepage',
      //   name: 'personalHomepage',
      //   component: () => import('@/views/personalHomepage/Index.vue'),
      //   meta: {
      //     hideNav: true
      //   }
      // },
      {
        path: '/organizationStructure',
        name: 'organizationStructure',
        component: () => import('@/views/organizationStructure/Index.vue'),
        meta: {
          hideNav: true
        }
      },
      {
        path: '/shipping', // 船舶信息
        name: 'shipping',
        component: () => import('@/views/shipping/Index.vue'),
        meta: {
          needLogin: true,
          hideNav: true,
          role: ['05', '06'] // 只有身份为【船东】、【船管】，才能进入
        }
      },
      {
        path: '/personalHomepage', // 个人中心
        name: 'personalHomepage',
        component: () => import('@/views/personalHomepage/Index.vue'),
        meta: {
          needLogin: true,
          hideNav: true
        },
        children: [
          {
            path: '/user/dockOrder', // 发布的坞修单
            name: 'userdockOrder',
            component: () => import('@/views/userCenter/shipowner/DockOrder.vue'),
            meta: {
              role: ['05', '06'] // 只有身份为【船东】、【船管】，才能进入
            }
          },
          {
            path: '/user/procurement', // 发布的采购单
            name: 'userprocurement',
            component: () => import('@/views/userCenter/shipowner/Procurement.vue'),
            meta: {
              role: ['05', '06', '07'] // 只有身份为【船东】、【船管】、【修船厂】，才能进入
            }
          },
          {
            path: '/user/externalAssistance', // 发布的外协单
            name: 'userexternalAssistance',
            component: () => import('@/views/userCenter/shipowner/ExternalAssistance.vue'),
            meta: {
              role: ['05', '06', '07'] // 只有身份为【船东】、【船管】、【修船厂】，才能进入
            }
          },
          {
            path: '/user/dockOrder/invitationQuotation', // 坞修单 邀请我报价列表
            name: 'userDockOrderInvitationQuotation',
            component: () => import('@/views/userCenter/dockOrder/InvitationQuotation.vue'),
            meta: {
              role: ['wxfws', 'cgfws', 'waxfws'] // 只有【维修服务商】【采购服务商】【外协服务商】三种类型的用户显示
            }
          },
          {
            path: '/user/procurement/invitationQuotation', // 采购单 邀请我报价列表
            name: 'userProcurementInvitationQuotation',
            component: () => import('@/views/userCenter/procurement/InvitationQuotation.vue'),
            meta: {
              role: ['cgfws'] // 只有【采购服务商】类型的用户显示
            }
          },
          {
            path: '/user/externalAssistance/invitationQuotation', // 外协单 邀请我报价列表
            name: 'userExternalAssistanceInvitationQuotation',
            component: () => import('@/views/userCenter/externalAssistance/InvitationQuotation.vue'),
            meta: {
              role: ['waxfws'] // 只有【外协服务商】类型的用户显示
            }
          },
          {
            path: '/user/priceSheet', // 收到的报价单
            name: 'userPriceSheet',
            component: () => import('@/views/userCenter/shipowner/PriceSheet.vue'),
            meta: {
              role: ['05', '06', '07'] // 只有身份为【船东】、【船管】、【修船厂】，才能进入
            }
          },
          {
            path: '/user/dockOrderPriceComparative', // 坞修 比价单
            name: 'userDockOrderPriceComparative',
            component: () => import('@/views/userCenter/shipowner/DockOrderPriceComparative.vue'),
            meta: {
              role: ['05', '06']
            }
          },
          {
            path: '/user/procurementPriceComparative', // 采购 比价单
            name: 'userProcurementPriceComparative',
            component: () => import('@/views/userCenter/shipowner/ProcurementPriceComparative.vue'),
            meta: {
              role: ['05', '06', '07']
            }
          },
          {
            path: '/user/externalAssistancePriceComparative', // 外协 比价单
            name: 'userExternalAssistancePriceComparative',
            component: () => import('@/views/userCenter/shipowner/ExternalAssistancePriceComparative.vue'),
            meta: {
              role: ['05', '06', '07']
            }
          },
          {
            path: '/user/PriceComparativeList', // 比价单 列表
            name: 'userPriceComparative',
            component: () => import('@/views/userCenter/shipowner/PriceComparativeList.vue'),
            meta: {
              role: ['05', '06', '07'] // 只有身份为【船东】、【船管】、【修船厂】，才能进入
            }
          },
          {
            path: '/user/dockOrder/priceSheet', // 维修服务商 发布的报价单
            name: 'userDockOrderPriceSheet',
            component: () => import('@/views/userCenter/dockOrder/PriceSheet.vue'),
            meta: {
              role: ['wxfws'] // 只有【维修服务商】类型的用户显示
            }
          },
          {
            path: '/user/dockOrder/orderList', // 完工单
            name: 'userDockOrderOrderList',
            component: () => import('@/views/userCenter/dockOrder/OrderList.vue'),
            meta: {
              role: ['wxfws'] // 只有【维修服务商】类型的用户显示
            }
          },
          {
            path: '/user/dockOrder/orderDetail', // 完工单 详情
            name: 'userDockOrderOrderDetail',
            component: () => import('@/views/userCenter/dockOrder/OrderDetail.vue'),
            meta: {
              role: ['wxfws'] // 只有【维修服务商】类型的用户显示
            }
          },
          {
            path: '/user/checkDetail', // 账单 详情
            name: 'userCheckDetail',
            component: () => import('@/views/userCenter/dockOrder/CheckDetail.vue'),
            meta: {}
          },
          {
            path: '/user/procurement/priceSheet', // 采购服务商 发布的报价单
            name: 'userProcurementPriceSheet',
            component: () => import('@/views/userCenter/procurement/PriceSheet.vue'),
            meta: {
              role: ['cgfws'] // 只有【采购服务商】类型的用户显示
            }
          },
          {
            path: '/user/externalAssistance/priceSheet', // 外协服务商 发布的报价单
            name: 'userExternalAssistancePriceSheet',
            component: () => import('@/views/userCenter/externalAssistance/PriceSheet.vue'),
            meta: {
              role: ['waxfws'] // 只有【外协服务商】类型的用户显示
            }
          },
          {
            path: '/user/check', // 账单
            name: 'userCheck',
            component: () => import('@/views/userCenter/shipowner/Check.vue'),
            meta: {
              role: ['05', '06', '07'] // 只有身份为【船东】、【船管】、【修船厂】，才能进入
            }
          },
          {
            path: '/user/daily', // 维修日报
            name: 'userDaily',
            component: () => import('@/views/userCenter/shipowner/Daily.vue'),
            meta: {
              role: ['05', '06'] // 此页面只有【船东】、【船管】两种类型的企业可见。企业下的所有成员都可使用
            }
          },
          {
            path: '/user/evaluate', // 评价
            name: 'userEvaluate',
            component: () => import('@/views/userCenter/shipowner/Evaluate.vue'),
            meta: {
              role: ['05', '06', '07'] // 只有身份为【船东】、【船管】、【修船厂】，才能进入
            }
          }
        ]
        // ****
      },

      {
        path: '/user/dockOrderDetail', // 发布的坞修单 详情
        name: 'userdockOrderDetail',
        component: () => import('@/views/userCenter/shipowner/DockOrderDetail.vue'),
        meta: {
          hideNav: true
        }
      },

      {
        path: '/user/procurementDetail', // 发布的采购单 详情
        name: 'userprocurementDetail',
        component: () => import('@/views/userCenter/shipowner/ProcurementDetail.vue'),
        meta: {
          hideNav: true
        }
      },
      {
        path: '/user/externalAssistanceDetail', // 发布的外协单 详情
        name: 'userexternalAssistanceDetail',
        component: () => import('@/views/userCenter/shipowner/ExternalAssistanceDetail.vue'),
        meta: {
          hideNav: true
        }
      },
      {
        path: '/user/dockOrder/onlineQuotation', // 坞修单 在线报价
        name: 'userDockOrderOnlineQuotation',
        component: () => import('@/views/userCenter/dockOrder/OnlineQuotation.vue'),
        meta: {
          // role: ['wxfws', 'cgfws', 'waxfws'], // 只有【维修服务商】【采购服务商】【外协服务商】三种类型的用户显示
          hideNav: true
        }
      },
      {
        path: '/user/procurement/onlineQuotation', // 采购单 在线报价
        name: 'userProcurementOnlineQuotation',
        component: () => import('@/views/userCenter/procurement/OnlineQuotation.vue'),
        meta: {
          // role: ['cgfws'], // 只有【采购服务商】类型的用户显示
          hideNav: true
        }
      },
      {
        path: '/user/externalAssistance/onlineQuotation', // 外协单 在线报价
        name: 'userExternalAssistanceOnlineQuotation',
        component: () => import('@/views/userCenter/externalAssistance/OnlineQuotation.vue'),
        meta: {
          // role: ['waxfws'], // 只有【采购服务商】类型的用户显示
          hideNav: true
        }
      },
      {
        path: '/bLogTrends',
        name: 'bLogTrends',
        component: () => import('@/views/personalHomepage/BLogTrends.vue'),
        meta: {
          hideNav: true
        }
      },
      {
        path: '/dialogue', // 移动端 对话
        name: 'dialogue',
        component: () => import('@/views/m/Dialogue.vue'),
        meta: {
          hideFooter: true, // 隐藏底部
          needLogin: true
        }
      }
    ]
  },
  {
    path: '/login', // 移动端 登录
    name: 'login',
    component: () => import('@/views/m/Login.vue')
  },
  {
    path: '/mPublishArticle', // 移动端发布文章
    name: 'mPublishArticle',
    component: () => import('@/views/m/PublishArticle.vue')
  },
  {
    path: '/mJobPosting', // 移动端发布招聘
    name: 'mJobPosting',
    component: () => import('@/views/m/JobPosting.vue')
  },
  {
    path: '/mRecruitmentDetails', // 移动端招聘信息详情
    name: 'mRecruitmentDetails',
    component: () => import('@/views/m/RecruitmentDetails.vue')
  },
  {
    path: '/register',
    name: 'register',
    component: () => import('@/views/login/Register.vue'),
    meta: {
      hideFooter_m: true // 移动端 隐藏底部
    }
  },
  {
    path: '/agreement',
    name: 'agreement',
    component: () => import('@/views/login/Agreement.vue'),
    meta: {
      hideDialoge: true // 隐藏对话框
    }
  },
  {
    path: '/passwordRecovery',
    name: 'passwordRecovery',
    component: () => import('@/views/login/PasswordRecovery.vue'),
    meta: {
      hideFooter_m: true // 移动端 隐藏底部
    }
  },
  {
    path: '/404',
    name: 'not-found',
    component: () => import('@/views/layout/404.vue')
  },
  {
    path: '/:pathMatch(.*)',
    redirect: '/404'
  }
]

const router = createRouter({
  history: createWebHashHistory(),
  routes
})

router.beforeEach((to, from, next) => {
  // console.log(to, from)
  const $isMobile = Boolean(navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i))

  document.documentElement.scrollTop = 0 // 回到顶部
  NProgress.start()

  const store = useLogin()
  const { setLoginDialog } = store

  const {
    meta: { title, role, rerole, errmsg, needLogin, freeze }
  } = to

  document.title = `${t('document.title')}${title ? '-' + t(title) : ''}`
  watch(i18n.global.locale, (n) => {
    document.title = `${t('document.title')}${title ? '-' + t(title) : ''}`
  })

  // 需要登录
  if (needLogin) {
    if (!store.userInfo) {
      if (!$isMobile) {
        ElMessage.warning(t('needLogin'))
        setLoginDialog(true)
      } else {
        next('/login')
      }
      next(false)
      return
    }
  }

  // 冻结的账号 只能访问指定页
  if (store.userInfo?.status === '2' && !freeze) {
    next(false)
    return
  }

  // 指定身份 可进
  if (role) {
    if (!role.includes(store.userInfo.customerClassCode) && !role.includes(store.userInfo.registerClassCode)) {
      if (errmsg) {
        ElMessage.warning(errmsg)
        next(false)
      } else {
        next('/404')
      }
      return
    }
  }

  // 指定身份 不可进
  if (rerole) {
    if (rerole.includes(store.userInfo.customerClassCode) || rerole.includes(store.userInfo.registerClassCode)) {
      if (errmsg) {
        ElMessage.warning(errmsg)
        next(false)
      } else {
        next('/404')
      }
      return
    }
  }

  next()
})

router.afterEach(() => {
  NProgress.done()
})

export default router
